<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>系统管理</title>
    <link href="css/bootstrap.min.css" rel="stylesheet">
    <link href="css/index.css" rel="stylesheet">
</head>
<body>
<div class="container">
    <ul class="nav nav-tabs nav-technology" id="myTab" role="tablist">
        <li class="nav-item" role="presentation">
            <button class="nav-link active" id="home-tab" data-bs-toggle="tab" data-bs-target="#home" type="button"
                    role="tab" aria-controls="home" aria-selected="true">首页
            </button>
        </li>
        <li class="nav-item" role="presentation">
            <button class="nav-link" id="config-tab" data-bs-toggle="tab" data-bs-target="#config" type="button"
                    role="tab" aria-controls="config" aria-selected="false">系统配置
            </button>
        </li>
        <li class="nav-item" role="presentation">
            <button class="nav-link" id="log-tab" data-bs-toggle="tab" data-bs-target="#log" type="button" role="tab"
                    aria-controls="log" aria-selected="false">日志管理
            </button>
        </li>
    </ul>
    <div class="tab-content" id="myTabContent">
        <div class="tab-pane fade show active" id="home" role="tabpanel" aria-labelledby="home-tab">
            <!-- 首页内容 -->
            <div class="text-center mt-4">
                <button class="btn btn-success">重置配置</button>
                <button class="btn btn-danger" id="stop-button">停止服务</button>
            </div>
            <div class="mt-4">
                <table class="table table-bordered form-background">
                    <thead>
                    <tr>
                        <th>系统信息</th>
                        <th>参数值</th>
                    </tr>
                    </thead>
                    <tbody>
                    <tr>
                        <td>系统版本</td>
                        <td id="system-version"></td>
                    </tr>
                    <tr>
                        <td>运行时长</td>
                        <td id="system-runtime"></td>
                    </tr>
                    <tr>
                        <td>访问地址</td>
                        <td id="system-homeUrl"></td>
                    </tr>
                    <tr>
                        <td>用户目录</td>
                        <td id="system-userHome"></td>
                    </tr>
                    <tr>
                        <td>操作系统</td>
                        <td id="system-osName"></td>
                    </tr>
                    <tr>
                        <td>系统架构</td>
                        <td id="system-osArch"></td>
                    </tr>
                    <tr>
                        <td>处理器核心数量</td>
                        <td id="system-cpuCoreNum"></td>
                    </tr>
                    <tr>
                        <td>磁盘总容量</td>
                        <td id="system-diskTotal"></td>
                    </tr>
                    <tr>
                        <td>磁盘可用容量</td>
                        <td id="system-diskFree"></td>
                    </tr>
                    <tr>
                        <td>内存总大小</td>
                        <td id="system-memoryTotal"></td>
                    </tr>
                    <tr>
                        <td>内存可用大小</td>
                        <td id="system-memoryFree"></td>
                    </tr>
                    </tbody>
                </table>
            </div>
        </div>

        <div class="tab-pane fade" id="config" role="tabpanel" aria-labelledby="config-tab">
            <hr>
            <div class="config-container">
                <div class="form-row">
                    <div class="form-group col-md-6">
                        <label for="config-mountPath">挂载路径</label>
                        <input type="text" class="form-control" id="config-mountPath">
                    </div>
                    <div class="form-group col-md-6">
                        <label for="config-storagePath">存储路径</label>
                        <input type="text" class="form-control" id="config-storagePath">
                    </div>
                </div>
                <div class="form-row">
                    <div class="form-group col-md-6">
                        <label for="config-host">主机地址</label>
                        <input type="text" class="form-control" id="config-host">
                    </div>
                    <div class="form-group col-md-6">
                        <label for="config-port">监听端口</label>
                        <input type="text" class="form-control" id="config-port">
                    </div>
                </div>
                <div class="form-row">
                    <div class="form-group col-md-6">
                        <label for="config-readBufferSize">读缓冲区大小 (字节)</label>
                        <input type="text" class="form-control" id="config-readBufferSize">
                    </div>
                    <div class="form-group col-md-6">
                        <label for="config-writeBufferSize">写缓冲区大小 (字节)</label>
                        <input type="text" class="form-control" id="config-writeBufferSize">
                    </div>
                </div>
                <div class="form-row">
                    <div class="form-group col-md-6">
                        <label for="config-defaultLevel">日志级别</label>
                        <input type="text" class="form-control" id="config-defaultLevel">
                    </div>
                    <div class="form-group col-md-6">
                        <label for="config-loggerPath">日志路径</label>
                        <input type="text" class="form-control" id="config-loggerPath">
                    </div>
                </div>
                <div class="form-row">
                    <div class="form-group col-md-6">
                        <label for="config-username">身份认证 - 账号</label>
                        <input type="text" class="form-control" id="config-username">
                    </div>
                    <div class="form-group col-md-6">
                        <label for="config-password">身份认证 - 密码</label>
                        <input type="password" class="form-control" id="config-password">
                    </div>
                </div>
            </div>
        </div>

        <!-- 日志管理内容 -->
        <div class="tab-pane fade" id="log" role="tabpanel" aria-labelledby="log-tab">
            <table class="table table-bordered table-background">
                <thead>
                <tr>
                    <th>日志时间</th>
                    <th>日志存放路径</th>
                    <th>操作</th>
                </tr>
                </thead>
                <tbody id="log-tbody">
                </tbody>
            </table>
        </div>
    </div>
</div>
</body>
<script src="js/bootstrap.bundle.min.js" type="text/javascript"></script>
<script src="js/jquery.min.js" type="text/javascript"></script>
<script src="js/index.js" type="text/javascript"></script>
</html>